Creating property driven animations

Use property driven animations when you want to use a property type instead of time to control a keyframe animation. For example, with property driven animations you can control the position of a gauge needle with a property type using a keyframe animation.

To create property driven animations:

  1. Select or create a keyframe animation.
    For example, to create a keyframe animation which you can use to rotate a gauge needle:
    1. In the Library press Alt and right-click Animations and select Animation.
    2. In the Properties set:
      • Target Property to Node3D.RenderTransformation
      • Property Attribute to Rotation Z
    3. In the Library double-click the animation you created in the first step to open it in the Animation Clip Editor and in the Animation Clip Editor use the Move tool to select the animation in the canvas area.
    4. Select the Keyframe tool and click the animation twice to create two keyframes.
    5. Select the Move tool , select the first keyframe and set:
      • Time to 0
        In property driven animations you control the time of the animation with the Time Controller Property Type you select in the Property Driven Animation Player. You do this in the last step of this procedure.
      • Value to 0
        In property driven animations you control the value of the property set in this animation with the Value property. In this example you control the value of the of the Node3D.RenderTransformation property, Rotation Z property field.
    6. Select the second keyframe in the animation and set:
      • Time to 270
      • Value to -270
        When you set the value to -270, the animation rotates the gauge needle by 270 degrees in counterclockwise direction.
  2. In the Project create the node you want to control with a property driven animation.
    For example, in the Assets set Source to Factory Content, from the Assets drag the Cluster Gauges item to the Preview.
  3. In the Project select the node you want to control with a property driven animation.
    For example, in the Project select the Cluster Gauges > Gauge Scene > RootNode > Model > Speed Gauge > Speed Needle node.
  4. In the Properties right-click and select Add Property > Controller Properties > Gauges.Speed.
    You must add the property with which you want to control the animation to the node where you use the Property Driven Animation Player. The Cluster Gauges factory content item already contains a Gauges.Speed custom property type.
  5. In the Node Components > Animation section click + Add Animation and select Property Driven Animation Player.
  6. In the Node Components > Animation section in the Property Driven Animation Player set:

When you change the value of the property you set in the Time Controller Property Type, the Property Driven Animation Player changes the value of the property and property attribute set in the animation. In this example, the Property Driven Animation Player changes the Render Transformation property, Rotation Z property field to rotate the Speed Needle node.

Using Property Driven Animation Player in the API

To create property driven animation player and specify its timeline and time controller property:

// Create property driven animation player.
PropertyDrivenAnimationPlayerSharedPtr player = PropertyDrivenAnimationPlayer::create(domain, "player");
// Set timeline.
player->setTimeline(timeline);
// Set type name of time controller property.
player->setTimeControllerPropertyType(timePropertyType.getName());

To attach property driven animation player to the node:

node->addNodeComponent(player);

For details, see the PropertyDrivenAnimationPlayer class in the API reference.

See also

Interpolating property values

Animations